﻿@using Lavka.Core
@using Lavka.Models

<script type="text/javascript">

    var scrollPos = 0;
    var scrollStep = 200;

    function ScrollDown() {
        if ($("#scroll-content").height() - $(".scrollable").height() >= scrollPos) {
            scrollPos += scrollStep;
            $('div.scrollable').animate({ scrollTop: scrollPos }, 'slow');
        }
        else {
            scrollPos = $("#scroll-content").height() - $(".scrollable").height();
            $('div.scrollable').animate({ scrollTop: scrollPos }, 'slow');
        }
    }

    function ScrollUp() {
        if (scrollPos - $(".scrollable").height() >= 0) {
            scrollPos -= $(".scrollable").height();
            $('.scrollable').animate({ scrollTop: scrollPos }, 'slow');
        }
        else {
            scrollPos = 0;
            $('.scrollable').animate({ scrollTop: scrollPos }, 'slow');
        }
    }

</script>

<div class="body">
    <div onclick="ScrollUp()" class="clickable" id="btnUp">
        <img src="@Url.Content("~/Content/images/arrow-top.png")" style="border: none;"/>
    </div>
    <div class="scrollable">
        <div id="scroll-content">
        @foreach (Actions action in ActionsHelper.GetActionProducts(new LavkaDbEntities()))
        {
            <div class="action-item">
                <a href="/Products/Details/@action.ProductId" class="action-item-link">
                    @{
                        string Name = action.Products.Reference + " " + @action.Products.Name;
                    }

                    <span class="action-link-title">@Name</span>
        
                    @if (!string.IsNullOrEmpty(action.Products.Photo))
                    {
                        <div class="action-image">
                            <div>
                                <img src="@Url.Content("~/Content/images/acton.png")" alt="Акция" class="action-image-bage" />
                            </div>
                            <div class="action-image-bage-text">@action.Title</div>
                            <img src="@Url.Content(action.Products.Photo)" alt="@action.Products.Name" class="ui-corner-all" />
                        </div>
                    }
                </a>
            </div>
            <div style="clear: both;"></div>            
        }
        </div>
    </div>
    <div onclick="ScrollDown()" class="clickable" id="btnDown">
        <img src="@Url.Content("~/Content/images/arrow-bottom.png")" style="border: none;"/>
    </div>
</div>